<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"  
                xmlns:h="http://java.sun.com/jsf/html"  
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../templates/StaffTemplate.xhtml">

    <ui:define name="nav_menu">
        <p:menubar model="#{staffChangeInitialPasswordManagedBean.staffMenuModel}"/>
    </ui:define>
    <ui:define name="content">
        <h:form>
            <h1>Review ULPItem application details</h1>
            <p:growl id="messages" />
            <p:fieldset style="width:950px">
                <f:metadata>
                    <f:viewParam name ="activate" value ="#{tCubeULPManagerBean.selectedULPItem.ULPItem.visibility}" />
                </f:metadata>
                <p:ajaxStatus style="width:16px;height:16px;">
                    <f:facet name="start">
                        <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                    </f:facet>
                    <f:facet name="complete">
                        <h:outputText value="" />
                    </f:facet>
                </p:ajaxStatus>

                <h:panelGrid columns="2" columnClasses="column" cellpadding="5">
                    <h:panelGrid columns="2" border="1" columnClasses="column" cellpadding="5">

                        <h:outputText value="ULP Item Name: " style="font-weight:bold; text-align:center; font-size:12px" />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.name}" />

                        <h:outputText value="Company name: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpName}" />

                        <h:outputText value="Cost of item: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.costOfItem} SGD"/>

                        <h:outputText value="Maximum Issued Quantity: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.maxQuantity}"/>

                        <h:outputText value="Offer From: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.validFrom}">
                            <f:convertDateTime dateStyle="full" pattern="EEE, dd/MM/yyyy" timeZone="EST" type="date" />
                        </h:outputText>

                        <h:outputText value="Offer Until: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.validUntil}">
                            <f:convertDateTime dateStyle="full" pattern="EEE, dd/MM/yyyy" timeZone="EST" type="date" />
                        </h:outputText>

                        <h:outputText value="Voucher's Valid Period: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.validPeriod} month(s)"/>                                     

                        <h:outputText value="Status: " style="font-weight:bold; text-align:center; font-size:12px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.status}"/>

                    </h:panelGrid>

                    <p:graphicImage id="imageDisplay" value="/images/upload/media/#{tCubeULPManagerBean.selectedULPItem.ULPItem.imageURL}"
                                    height="300" width="450"/> 

                </h:panelGrid>  
                <br/>
                <p:fieldset legend="Highlights" toggleable="true" toggleSpeed="500"
                            onToggleUpdate="growl" style="width:900px">
                    <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.highlight}" escape="false"/>
                </p:fieldset>
                <br/>
                <p:fieldset legend="Fine Print" toggleable="true" toggleSpeed="500"
                            onToggleUpdate="growl" style="width:900px">
                    <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.fineprint}" escape="false"/>
                </p:fieldset>
                <br/>
                <p:fieldset legend="Description" toggleable="true" toggleSpeed="500"
                            onToggleUpdate="growl" style="width:900px">
                    <h:panelGrid columns="1" cellpadding="10">
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.name}" style="font-weight:bold; text-align:center; font-size:14px"/>
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.description}" escape="false"/>
                    </h:panelGrid>
                </p:fieldset>
                <br/>
                <p:fieldset legend="Company's contact information" toggleable="true" toggleSpeed="500"
                            onToggleUpdate="growl" style="width:900px" rendered="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder != null}">
                    <h:panelGrid columns="2" columnClasses="column" cellpadding="5">
                        <h:outputText value="Company name: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpName}" />

                        <h:outputText value="Contact person: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpContactPerson}" />

                        <h:outputText value="Phone number: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpContactNumber}" />

                        <h:outputText value="Fax number: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpFaxNumber}" />

                        <h:outputText value="Email address: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.corpEmail}" />

                        <h:outputText value="Office number: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.address.houseNumber}" />

                        <h:outputText value="Building name: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.address.buildingName}" />

                        <h:outputText value="Street name: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.address.streetName}" />

                        <h:outputText value="Postal code: " />
                        <h:outputText value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder.address.postalCode}" />

                    </h:panelGrid>
                </p:fieldset>
                <br/>

                <h:panelGrid columns="2" cellpadding="5" rendered="#{tCubeULPManagerBean.selectedULPItem.ULPItem.stakeholder != null}">
                    <h:outputText value="Remarks from stakeholder: " />
                    <h:outputText style="width:300px;height:100px;" id="remarkFromStakeholder" value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.remarkFromStakeholder}"/>
                </h:panelGrid>

                <h:panelGrid columns="3" cellpadding="5">
                    <h:outputText value="Remarks from TCube: " />
                    <p:inputTextarea style="width:300px;height:100px;" effectDuration="400" id="remarkFromTCube" value="#{tCubeULPManagerBean.selectedULPItem.ULPItem.remarkFromTCube}">
                        <p:ajax event="blur" update="remarkMsg" />
                    </p:inputTextarea>
                    <p:message id="remarkMsg" for="remarkFromTCube" />
                </h:panelGrid>

                <h:panelGrid columns="2" columnClasses="column" cellpadding="5">
                    <h:outputLabel for="activate" style="font-weight: bold" value="Activation status: " />
                    <h:outputText value ="#{tCubeULPManagerBean.selectedULPItem.ULPItem.visibility}" />

                    <p:button value="Activate" disabled="#{tCubeULPManagerBean.selectedULPItem.ULPItem.visibility}" outcome="TCubeEditULPItem">
                        <f:param name="activate" value="true" />
                    </p:button>

                    <p:button value="Deactivate" disabled="#{!tCubeULPManagerBean.selectedULPItem.ULPItem.visibility}" outcome="TCubeEditULPItem">
                        <f:param name="activate" value="false" />
                    </p:button>

                    <p:commandButton id="back" value="Back" ajax="true" action="staff/TCubeViewOfferedULPItems?faces-redirect=true"/>
                    <p:commandButton id="btn" value="Save" update="panel" actionListener="#{tCubeULPManagerBean.doEditULPItem}" ajax="true" />
                </h:panelGrid>         
            </p:fieldset>
        </h:form>
    </ui:define>
</ui:composition>
